<template>
	<view class="content">
		<view class="status-text">
			<text>任务状态： {{this.$dict.selectDictLabel('mes_order_status', this.form.status)}}</text>
		</view>
		<u-form :border-bottom="false" :model="form" ref="uForm">
			<view class="form-content" style="margin-top: 3%;">
				<u-form-item :border-bottom="false" label-width="30%" label="工序:">
					<text class="form-text">{{form.processName}}</text>
				</u-form-item>
				<u-form-item :border-bottom="false" label-width="30%" label="客户订单:">
					<text class="form-text">{{form.clientOrderCode}}</text>
				</u-form-item>   
				<u-form-item :border-bottom="false" label-width="30%" label="计划生产:">
					<text class="form-text">{{form.quantity + ' ' + $convertUnitmeasure(form.unitOfMeasure)}}</text>
				</u-form-item>
				<u-form-item :border-bottom="false" label-width="30%" label="已生产:">
					<text class="form-text">{{form.quantityQuanlify + ' ' + $convertUnitmeasure(form.unitOfMeasure)}}</text>
				</u-form-item>
				<u-form-item :border-bottom="false" label-width="30%" label="结束时间:">
					<text class="form-text">{{this.$dayjs(form.endTime).format('YYYY-MM-DD')}}</text>
				</u-form-item>
			</view>
			<u-divider style="margin-top: 2%;" bg-color="#f3f6f9" fontSize="40" color="#2a2b2d">报工记录详单</u-divider>
			<view style="margin-top: 3%;">
				<text style="font-size: 20px;margin-left: 3%; color:#7da6ec">共计报工次数: {{this.feedbackList.length}} 次</text>
				<uni-list  :border="false" v-for="item in feedbackList" :key="item.recordId">
					<uni-list-item style="background-color: #f3f6f9;" :title="convertFeedbackTime(item.feedbackTime)"
						:note="convertQuantity(item)">
					</uni-list-item>
				</uni-list>
			</view>
		</u-form>
		<view style="margin-top: 4%;">
			<u-row>
				<u-col>
					<u-button class="btn-gap" type="success" shape="circle" @click="back">返回任务列表</u-button>
				</u-col>
			</u-row>
		</view>
	</view>
</template>

<script>
	import {
		getTaskAndFeedback,
		addFeedback
	} from "@/api/work/feedback/feedback"

	export default {
		data() {
			return {
				form: {
					taskId: null,
					taskCode: null,
					taskName: null,
					workorderId: null,
					workorderCode: null,
					workorderName: null,
					workstationId: null,
					workstationCode: null,
					workstationName: null,
					routeId: null,
					processId: null,
					processCode: null,
					processName: null,
					itemId: null,
					itemCode: null,
					itemName: null,
					specification: null,
					unitOfMeasure: null,
					quantity: null,
					quantityProduced: null,
					quantityChanged: null,
					clientId: null,
					clientCode: null,
					clientName: null,
					clientNick: null,
					startTime: null,
					duration: null,
					endTime: null,
					requestDate: null,
					remark: null,
					attr1: null,
					attr2: null,
					attr3: null,
					attr4: null,
					createBy: null,
					createTime: null,
					updateBy: null,
					updateTime: null,
					quantityUnquanlified: null,
					quantityQualified: null
				},
				taskId: undefined,
				btnDisable: false,
				feedbackList: []
			}
		},
		onLoad(options) {
			this.taskId = options.taskId;
			this.getTaskAndFeedback(this.taskId);
		},
		methods: {
			getTaskAndFeedback(taskId) {
				if (this.$isEmpty(taskId)) {
					uni.showToast({
						title: '无法获取数据，请稍候再试',
						icon: 'none',
						duration: 2000
					});
					return;
				}
				getTaskAndFeedback(taskId).then(res => {
					this.form = res.data.task
					this.feedbackList = res.data.feedbackList
				})
			},
			back() {
				uni.navigateBack({
					delta: 1
				})
			},
			convertQuantity(item) {
				return `报工数量共计: ${item.quantityFeedback} , 其中合格产品数量: ${item.quantityQualified} ${this.$convertUnitmeasure(item.unitOfMeasure)} ,
				不合格产品数量: ${item.quantityUnquanlified == null ? 0 : item.quantityUnquanlified} ${this.$convertUnitmeasure(item.unitOfMeasure)}`
			},
			convertFeedbackTime(feedbackTime) {
				return '报工时间: ' + feedbackTime
			}
		}
	}
</script>

<style lang="scss">
	/deep/ .uni-list-item__content-title {
		font-size: 18px;
	}

	/deep/ .uni-list-item__content-note {
		font-size: 16px;
	}

	/deep/ .uni-list-item__extra-text {
		font-size: 16px;
		color: #7da6ec;
	}
	
	.title-text {
		height: 8%;
		display: flex;
		align-items: center;
		margin-left: 2%;
		font-size: 18px;
		font-weight: bold;

	}

	.status-text {
		margin-left: 3%;
		border-radius: 15px;
		height: 8%;
		display: flex;
		align-items: center;
		font-size: 20px;
		color: #7da6ec;
		font-weight: bold;
	}

	.content {
		background-color: #f3f6f9;
		height: 100%;
	}

	.form-content {
		border-radius: 15px;
		background-color: white;

		.u-form-item {
			margin-left: 3%;
			font-size: 18px;
		}

		.form-text {
			color: #999999;
			text-align: right;
			margin-left: 20%;
		}
	}
</style>